<%@page import="models.OrderProductModel"%>
<%@page import="java.util.TreeMap"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<%@page import="models.OrderModel"%>
<%@page import="java.util.Calendar"%>
<%@page import="models.GeoModel"%>
<%@page import="admin.data.GeoData"%>
<%@page import="com.google.appengine.api.blobstore.BlobKey"%>
<%@page import="com.google.appengine.api.images.ImagesServiceFactory"%>
<%@page import="com.google.appengine.api.images.ImagesService"%>
<%@page import="java.util.Locale"%>
<%@page import="java.text.NumberFormat"%>
<%@page import="models.DealModel"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%	
	HttpSession ses = request.getSession();
	OrderModel order = (OrderModel) ses.getAttribute("user_order");	
	DealModel deal = order.getDeal();	
	List<OrderProductModel> listProduct = order.getListOrderProductObject();	
	String city =(String)request.getAttribute("city");
	if(city==null){
		city = "ha-noi";
	}
	TreeMap check = new TreeMap();
	if(request.getAttribute("check")!=null){
		check = (TreeMap) request.getAttribute("check");
	}	
	ImagesService imagesService = ImagesServiceFactory.getImagesService();
	NumberFormat nf = NumberFormat.getNumberInstance(Locale.GERMAN);
%>
<jsp:include page="/layouts/header.jsp">
	<jsp:param name="language" value="1" />	
</jsp:include>	
<link rel="stylesheet" type="text/css" href="/css/ui-lightness/jquery-ui-1.8.18.custom.css" />
<script type="text/javascript" src="/js/jquery-ui-1.8.18.custom.min.js"></script>
<script type="text/javascript" src="/js/form-user.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		var unitPrice = <%=deal.getPriceDiscount()%>;	
		checkShipType();
		setTotalPrice();		
		$("#payAtGroupOn").click(function(){
			checkShipType();
		});
		$("#payAtHome").click(function(){
			checkShipType();
		});																
	 	$(".unitQuantity").change(function() {	 								 		  
	 		setTotalPrice();
	 	});	 
	 	function setTotalPrice(){
	 		var total = 0;
	 		$(".unitQuantity").each(function () {
				var totalUnitPrice = unitPrice*$(this).val();	
				total += totalUnitPrice;	
		 		$("#totalPrice-" + $(this).attr("id")).text(addCommas(totalUnitPrice));										
			});	
	 		if(total==0){	 			
	 			$(".button").attr("disabled", "disabled");
	 		}else{
	 			$(".button").removeAttr("disabled");
	 		}
	 		$("#totalPrice").text(addCommas(total));
	 	}
	 	function checkShipType(){
	 		if($("#payAtGroupOn").attr("class")!="chooseBuyInfo active"){
				$("#payAtGroupOn").attr("class", "chooseBuyInfo active");
				$("#payAtHome").attr("class", "chooseBuyInfo");
				$("#payAtHomeForm").hide(100);
				$("#payAtGroupOnForm").show(100);
				$("input[name='type']").attr("value","2");				
			}else{
				$("#payAtHome").attr("class", "chooseBuyInfo active");
				$("#payAtGroupOn").attr("class", "chooseBuyInfo");
				$("#payAtGroupOnForm").hide(100);
				$("#payAtHomeForm").show(100);
				$("input[name='type']").attr("value","1");				
			}
	 	}
	 	function addCommas(nStr)
	 	{
	 		nStr += '';
	 		x = nStr.split('.');
	 		x1 = x[0];
	 		x2 = x.length > 1 ? '.' + x[1] : '';
	 		var rgx = /(\d+)(\d{3})/;
	 		while (rgx.test(x1)) {
	 			x1 = x1.replace(rgx, '$1' + '.' + '$2');
	 		}
	 		return x1 + x2;
	 	}
	 	loadCity("<%=order.getShipCity() %>");
		loadDistrict("<%=order.getShipCity() %>", "<%=order.getShipDistrict() %>");
		loadWard("<%=order.getShipDistrict() %>", "<%=order.getShipWard()%>");
	});
</script> 			
        	<div id="content_inner">
            	<div id="productDetailInfo" class="clearafter">
                	<div class="left">                    	
                    	<div id="paymentPage">
                            <div class="checkoutSteps">
                            <form method="post" action="/dang-ky-mua-hang/thong-tin-thanh-toan">
                            <input type="hidden" name="action" value="thong-tin-thanh-toan"/>
                            <input type="hidden" name="type" value="<%=order.getShipType()%>"/>
								<div class="step-1">
                                	<div class="stepPanel">
                                		<%
                                			if(order.getOrderStep()>0){
                                		%>
                                		<a href="/dang-ky-mua-hang/thong-tin-thanh-toan" class="backToStep1"></a>
                                		<%
                                			}
                                		%>
                                		<%
                                			if(order.getOrderStep()>1){
                                		%>
                                		<a href="/dang-ky-mua-hang/hinh-thuc-thanh-toan" class="backToStep2"></a>
                                		<%
                                			}
                                		%>
	                                	<%
                                			if(order.getOrderStep()>2){
                                		%>
                                		<a href="/dang-ky-mua-hang/xac-nhan-don-hang" class="backToStep3"></a>
                                		<%
                                			}
                                		%>	
                                		<%
                                			if(order.getOrderStep()>3){
                                		%>
                                		<a href="/dang-ky-mua-hang/dat-hang-thanh-cong" class="backToStep4"></a>
                                		<%
                                			}
                                		%>	
                                		
                                	</div>
                                    <table cellpadding="0" cellpadding="0">
                                    	<thead>
                                        	<tr>
                                            	<th>Phiếu/Sản phẩm</th>
                                                <th>Đơn giá</th>
                                                <th>Số lượng</th>
                                                <th>Thành tiền</th>
                                            </tr>
                                        </thead>
                                        <tbody>                                        
                                        <%
                                    		if(listProduct!=null&&listProduct.size()>0){                                    			
                                    			for(OrderProductModel product : listProduct){
                                    	%>
                                        	<tr>
                                            	<td><%=product.getName() %></td>
                                            	<td align="center" class="price" id="price-<%=product.getProductId()%>"><%=nf.format(deal.getPriceDiscount()) %>VND</td>
                                                <td align="center">
	                                            	<select name="<%=product.getProductId()%>" class="unitQuantity" id="<%=product.getProductId()%>">
	                                            		<%
	                                            			for(int i=0;i<=10;i++){	                                            				
	                                            				%>
	                                            					<option value="<%=i%>" <%=(i==product.getQuantity())?"selected":""%>><%=i %></option>
	                                            				<%                                                      					                                            				
	                                            			}
	                                            		%>
	                                            	</select>                                            	                                       
	                                            </td>
                                               	<td align="right">                                               	                                               		
													<strong>
                                              			<span class="unitPrice" id="totalPrice-<%=product.getProductId()%>"><%=nf.format(deal.getPriceDiscount()) %>
                                              			</span>VND
                                              		</strong>                                               		
                                              	</td>                                                
                                            </tr>
                                            <%
                                    			}
                                    		}
                                            %>                                           
                                            <tr>
                                            	<td colspan="3" align="right">Số tiền phải trả</td>
                                                <td align="right">                                                	
                                                	<strong>
                                                		<span id="totalPrice"><%=nf.format(order.getUnitPrice()) %></span>VND
                                                	</strong>                                                	
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    <br />
                                    <p class="titlePage">Thông tin người nhận</p>
                                    <div class="chooseDeliveryType">                                    	
                                        <div id="atHome">
                                        	<div class="chooseBuyInfo <%=(order.getShipType()==1)?"active":""%>" id="payAtHome">
                                            	<div>
                                                    <h4>Giao hàng tận nơi</h4>
                                                    <p>Vui lòng cho biết địa chỉ giao phiếu/sản phẩm.</p>
                                                </div>
                                            </div>    
                                            <div id="payAtHomeForm">                                                                                    
                                            	<ul>
                                                	<li class="clearafter <%=(check.get("shipName") != null)?"error":""%>">
                                                        <label class="left">Họ tên (<span class="redColor">*</span>)</label>
                                                        <input type="text" class="left" value="<%=order.getShipName() %>" name="shipName"/>
                                                        <div class="clearbreak"></div>
                                                        <div class="errorMessage"><%=check.get("shipName") %></div>
                                                    </li>
                                                    <li class="clearafter <%=(check.get("shipMail") != null)?"error":""%>">
                                                        <label class="left">Email (<span class="redColor">*</span>)</label>
                                                        <input type="text" class="left" value="<%=order.getShipMail() %>" name="shipMail"/>
                                                        <div class="clearbreak"></div>
                                                        <div class="errorMessage"><%=check.get("shipMail") %></div>
                                                    </li>
                                                    <li class="clearafter <%=(check.get("shipPhoneNumber") != null)?"error":""%>">
                                                        <label class="left">Điện thoại di động (<span class="redColor">*</span>)</label>
                                                        <input type="text" class="left" value="<%=order.getShipPhoneNumber() %>" name="shipPhoneNumber"/>
                                                        <div class="clearbreak"></div>
                                                        <div class="errorMessage"><%=check.get("shipPhoneNumber") %></div>
                                                    </li>
                                                    <li class="clearafter <%=(check.get("shipAddressType") != null)?"error":""%>">
                                                        <label class="left">Giao hàng tại (<span class="redColor">*</span>)</label>
                                                        <p class="left">
                                                        	<label><input type="radio" name="shipAddressType" value="1" <%=order.getShipAddressType()==1?"checked":"" %>/> Nhà riêng</label>
                                                            <label><input type="radio" name="shipAddressType" value="2" <%=order.getShipAddressType()==2?"checked":"" %>/> Công ty quý khách</label>
                                                        </p>
                                                        <div class="clearbreak"></div>
                                                        <div class="errorMessage"><%=check.get("shipAddressType") %></div>
                                                    </li>
                                                    <li class="clearafter <%=(check.get("shipAddress") != null)?"error":""%>">
                                                        <label class="left">Địa chỉ (<span class="redColor">*</span>)</label>
                                                        <input type="text" class="left" value="<%=order.getShipAddress() %>" name="shipAddress"/>
                                                        <div class="clearbreak"></div>
                                                        <div class="errorMessage"><%=check.get("shipAddress") %></div>
                                                    </li>
                                                    <li class="clearafter <%=(check.get("city") != null||check.get("district") != null||check.get("ward") != null)?"error":""%>">
                                                        <label class="left">Tỉnh/Thành phố  (<span class="redColor">*</span>)</label>
                                                        <div class="left">                                                        	
                                                            <select name="city">
					                                            <option value="">Tỉnh/Thành phố</option>
					                                        </select>					                                                                                                   
                                                            <select name="district">
					                                            <option value="">Quận/Huyện</option>
					                                        </select>
					                                        <br/>
                                                            <select name="ward">
					                                            <option value="">Phường/Xã</option>
					                                        </select>
                                                        </div>
                                                        <div class="clearbreak"></div>
                                                        <%
                                                        	if(check.get("city") != null){
                                                        %>
                                                        <div class="errorMessage"><%=check.get("city") %></div>
                                                        <%
                                                        	}else if(check.get("district") != null){
                                                        %>
                                                        <div class="errorMessage"><%=check.get("district") %></div>
                                                        <%
                                                        	}else if(check.get("ward") != null){
                                                        %>
                                                        <div class="errorMessage"><%=check.get("ward") %></div>
                                                        <%
                                                        	}
                                                        %>
                                                    </li>
                                                    <li class="clearafter">
                                                        <label class="left">Ghi chú</label>
                                                        <textarea name="note" class="left"></textarea>
                                                    </li>
                                                </ul>
                                                <div class="content-center">
                                                	<button type="submit" class="button blue">Tiếp tục</button>
                                                </div>
                                            </div>
                                            
                                        </div>
                                        <div id="atCompany">
                                        	<div class="chooseBuyInfo <%=(order.getShipType()==1)?"active":"" %>" id="payAtGroupOn">
                                            	<div>
                                                    <h4>Nhận hàng tại onsale365.com.vn</h4>
                                                    <p>Vui lòng đến văn phòng onsale365.com.vn nhận phiếu/sản phẩm trực tiếp.</p>
                                                </div>
                                            </div>      
                                            <div  id="payAtGroupOnForm">                                      
                                            	<ul>
                                                	<li class="clearafter <%=(check.get("shipName1") != null)?"error":""%>">
                                                        <label class="left">Họ tên (<span class="redColor">*</span>)</label>
                                                        <input type="text" class="left" value="<%=order.getShipName()%>" name="shipName1"/>
                                                        <div class="clearbreak"></div>
                                                        <div class="errorMessage"><%=check.get("shipName1") %></div>
                                                    </li>
                                                    <li class="clearafter <%=(check.get("shipMail1") != null)?"error":""%>">
                                                        <label class="left">Email (<span class="redColor">*</span>)</label>
                                                        <input type="text" class="left" value="<%=order.getShipMail()%>" name="shipMail1"/>
                                                        <div class="clearbreak"></div>
                                                        <div class="errorMessage"><%=check.get("shipMail1") %></div>
                                                    </li>
                                                    <li class="clearafter <%=(check.get("shipPhoneNumber1") != null)?"error":""%>">
                                                        <label class="left">Điện thoại di động (<span class="redColor">*</span>)</label>
                                                        <input type="text" class="left" value="<%=order.getShipPhoneNumber()%>" name="shipPhoneNumber1"/>
                                                        <div class="clearbreak"></div>
                                                        <div class="errorMessage"><%=check.get("shipPhoneNumber1") %></div>
                                                    </li>
                                                    <li class="clearafter">
                                                        <label class="left">Địa chỉ nhận hàng</label>
                                                        <p class="left">Số 46 D2 Khu đô thị mới Đại Kim, Phường Đại Kim, Quận Hoàng Mai, Hà Nội.</p>                                                                                                                
                                                    </li>
                                                    <li class="clearafter">
                                                        <label class="left">Ghi chú</label>
                                                        <textarea name="note1" class="left"></textarea>                                                        
                                                    </li>
                                                </ul>
                                                <div class="content-center">
                                                	<button type="submit" class="button blue">Tiếp tục</button>
                                                </div> 
                                            </div>                                           
                                        </div>
                                        <div class="note">
                                        	 <strong class="redColor">Lưu ý</strong>
<p>Hiện nay onsale365.com.vn chưa giao hàng các địa điểm sau tại HÀ NỘI: Quận Long Biên, Huyện Từ Liêm, Huyện Thanh Trì, Huyện Gia Lâm, Huyện Đông Anh, Huyện Sóc Sơn, Thành phố Sơn Tây, Huyện Ba Vì, Huyện Phúc Thọ, Huyện Thạch Thất, Huyện Quốc Oai, Huyện Chương Mỹ, Huyện Đan Phượng, Huyện Hoài Đức, Huyện Thanh Oai, Huyện Mỹ Đức, Huyện Ứng Hòa, Huyện Thường Tín, Huyện Phú Xuyên.</p>
                                        </div>
                                    </div>
                                </div>
                                </form>
                            </div>                                                        
                        </div>
                    </div>
                    <div class="right rightSideBar">
                    	<jsp:include page="/elements/right_menu_payment.jsp"/>
                    </div>
                </div>
            </div>
<jsp:include page="/layouts/footer.jsp">
    <jsp:param name="language" value="1" />
</jsp:include>